// src\views\Login\Login.jsx
// 登录页
import { Col, Row,Form ,Button,Input, message} from 'antd'
import React from 'react';
import './Login.css'
import axios from 'axios';
import { withRouter } from 'react-router-dom';

 function Login(props) {
  // 成功
  const onFinish = (values) => {
    console.log('Success:', values);
    axios.get(`http://localhost:8888/users?username=${values.username}&password=${values.password}&_expand=role`).then(res=>{
      if(res.data.length){
        console.log(res.data);
        localStorage.setItem('token',JSON.stringify(res.data[0]));
        props.history.replace('/home')
      }else{
        message.error('账号或密码错误')
      }
    })
  };
  // 失败
  const onFinishFailed = (errorInfo) => {
    console.log('Failed:', errorInfo);
  };
  return (
    <div className='login'>
      <Row>
        <Col span={12} offset={6}>
          <Form
            name="basic"
            labelCol={{
              span: 8,
            }}
            wrapperCol={{
              span: 16,
            }}
            initialValues={{
              remember: true,
            }}
            onFinish={onFinish}
            onFinishFailed={onFinishFailed}
            autoComplete="off"
          >
            <Form.Item
              label="账号"
              name="username"
              rules={[
                {
                  required: true,
                  message: '请输入正确的账号',
                },
              ]}
            >
              <Input />
            </Form.Item>

            <Form.Item
              label="密码"
              name="password"
              rules={[
                {
                  required: true,
                  message: '请输入正确的密码',
                },
              ]}
            >
              <Input.Password />
            </Form.Item>
            <Form.Item
              wrapperCol={{
                offset: 16,
                span: 8,
              }}
            >
              <Button type="primary" htmlType="submit">
                登录
              </Button>
            </Form.Item>
          </Form>
        </Col>
      </Row>
    </div>
  )
}
export default withRouter(Login);